<div *ngIf="(gitConfig.githubAvailable && githubConfigured) || (gitConfig.gitlabAvailable && gitlabConfigured)">
    <div class="container">
        <div class="row">
            <div class="col-md-5">
                <div class="form-group">
                    <label for="selectedGitProvider">选择Git提供商：</label>
                    <select id="selectedGitProvider"
                            (ngModelChange)="refreshGitCompanyListByGitProvider($event)"
                            [(ngModel)]="data.selectedGitProvider"
                            name="data.selectedGitProvider"
                            class="form-control"
                            [disabled]="isRefreshing()"
                    >
                        <option *ngFor="let provider of data.availableGitProviders">{{provider}}</option>
                    </select>
                </div>
            </div>
        </div>
    </div>
    <div class="container">
        <div class="row">
            <div class="col-md-5">
                <div class="form-group">
                    <label for="gitCompany">选择公司：</label>
                    <select id="gitCompany" [(ngModel)]="data.selectedGitCompany" name="gitCompany"
                            class="form-control"
                            #ctrl="ngModel"
                            (ngModelChange)="updateGitProjectList($event)"
                            [disabled]="data.gitProjectListRefresh"
                    >
                        <option *ngFor="let company of data.gitCompanies">{{company.name}}</option>
                    </select>
                </div>
            </div>
            <div class="col-md-2" *ngIf="simpleMode">
                <div class="form-group">
                    <label>&nbsp;</label><br/>
                    <button class="btn btn-info btn-sm" (click)="refreshGitCompanyListByGitProvider(data?.selectedGitProvider)">
                        <fa-icon [icon]="'sync'" [spin]="data.gitCompanyListRefresh"></fa-icon>
                        <span>
                        刷新
                        </span>
                    </button>
                </div>
            </div>
            <ng-container *ngIf="!simpleMode">
                <div class="col-md-5">
                    <div class="form-group">
                        <label for="gitRepository">Git仓库</label>
                        <select id="gitRepository" (ngModelChange)="updateSelectedGitRepository($event)" [(ngModel)]="data.selectedGitRepository" name="gitRepository"
                                class="form-control"
                                #ctrl="ngModel"
                                [disabled]="isRefreshing()"
                        >
                            <option *ngFor="let project of data.gitProjects">{{project}}</option>
                        </select>
                    </div>
                </div>
                <div class="col-md-2">
                    <div class="form-group">
                        <label>&nbsp;</label><br/>

                        <button class="btn btn-info btn-sm" (click)="refreshGitProjectList()">
                            <fa-icon [icon]="'sync'" [spin]="data.gitProjectListRefresh"></fa-icon>
                            <span>
                            刷新
                            </span>
                        </button>
                    </div>
                </div>
            </ng-container>
        </div>
    </div>
</div>
